<template>
	<div>
		<el-card shadow="never">
			<div style="text-align: left;">
				<el-button type="primary" @click="addColumnClick">
					<i class="el-icon-plus"></i>
					添加设备类型
				</el-button>
			</div>
			<div style="clear:both"></div>
			<el-table v-loading="loading" :data="tableData" style="width: 100%;margin-top: 20px">
				<el-table-column label="治疗头名称" align="center" width="150" prop="institutionalName"></el-table-column>
				<el-table-column label="参数名" align="center" width="150" prop="institutionalSort"></el-table-column>
				<el-table-column label="幅度" align="center" width="150" prop="creator"></el-table-column>
				<el-table-column label="备注" align="center" width="150" prop="creatTime"></el-table-column>
				<el-table-column label="是否上传说明文档" align="center" width="150" prop="lastTime"></el-table-column>
				<el-table-column label="创建时间" align="center" width="150" prop="state"></el-table-column>
				<el-table-column label="修改时间" align="center" width="150" prop="state"></el-table-column>
				<el-table-column fixed="right" label="操作" align="center" width="250">
					<template slot-scope="scope">
						<el-button @click="cellClick(scope.row)" icon="el-icon-edit" type="warning" size="small">编辑</el-button>
						<el-switch v-model="switchVal" active-color="#13ce66" inactive-color="#ff4949"></el-switch>
						停启用
					</template>
				</el-table-column>
			</el-table>
			<div style="margin-top: 20px;text-align: right">
				<el-pagination
					background
					@current-change="columnFind"
					:current-page="page.page"
					:page-size="page.pagesize"
					layout="prev, pager, next, jumper, total"
					:total="page.count"
				></el-pagination>
			</div>
		</el-card>
		<el-dialog :title="cname" :visible.sync="dialogVisible" width="500px" :close-on-click-modal="false">
			<el-form :model="ruleForm" ref="ruleForm" label-width="100px" class="demo-ruleForm">
				<el-form-item label="治疗头名称" prop="name"><el-input v-model="searchInput" placeholder="请创建治疗头名称"></el-input></el-form-item>
				<el-form-item label="参数定义" prop="name"><el-input v-model="searchInput" placeholder="参数定义(百分比/定值)"></el-input></el-form-item>
				<el-form-item label="调节幅度限制" prop="name"><el-input v-model="searchInput" placeholder="调节幅度限制"></el-input></el-form-item>
				<el-form-item label="备注" prop="name">
					<el-input type="textarea" :autosize="{ minRows: 2, maxRows: 4 }" placeholder="请输入内容" v-model="textarea"></el-input>
				</el-form-item>
				<el-form-item label="上传说明文档" prop="name">
					<el-upload
						class="upload-demo"
						action="https://test.beauty-iot.com/appt/api/common/uploadImage"
						:on-preview="handlePreview"
						:on-remove="handleRemove"
						:before-remove="beforeRemove"
						multiple
						:limit="3"
						:on-exceed="handleExceed"
						:file-list="fileList"
					>
						<el-button size="small" type="primary">点击上传</el-button>
					</el-upload>
				</el-form-item>
			</el-form>
			<span slot="footer" class="dialog-footer">
				<el-button @click="resetForm('ruleForm')">取 消</el-button>
				<el-button type="primary" @click="submitForm('ruleForm')">保存</el-button>
			</span>
		</el-dialog>
		<el-dialog title :visible.sync="dialogColor" width="500px">
			<el-form :model="ruleForm" ref="ruleForm2" align="left" label-width="100px" class="demo-ruleForm">
				<el-form-item label="治疗头名称" prop="name"><el-input v-model="searchInput" placeholder="请创建治疗头名称"></el-input></el-form-item>
				<el-form-item label="参数定义" prop="name"><el-input v-model="searchInput" placeholder="参数定义(百分比/定值)"></el-input></el-form-item>
				<el-form-item label="调节幅度限制" prop="name"><el-input v-model="searchInput" placeholder="调节幅度限制"></el-input></el-form-item>
				<el-form-item label="备注" prop="name">
					<el-input type="textarea" :autosize="{ minRows: 2, maxRows: 4 }" placeholder="请输入内容" v-model="textarea"></el-input>
				</el-form-item>
				<el-form-item label="上传说明文档" prop="name">
					<el-upload
						class="upload-demo"
						action="https://jsonplaceholder.typicode.com/posts/"
						:on-preview="handlePreview"
						:on-remove="handleRemove"
						:before-remove="beforeRemove"
						multiple
						:limit="3"
						:on-exceed="handleExceed"
						:file-list="fileList"
					>
						<el-button size="small" type="primary">点击上传</el-button>
					</el-upload>
				</el-form-item>
			</el-form>
			<span slot="footer" class="dialog-footer">
				<el-button @click="dialogVisible = false">取 消</el-button>
				<el-button type="primary" @click="submitForm2('ruleForm2')">保 存</el-button>
			</span>
		</el-dialog>
	</div>
</template>

<script>
import { deviceList } from '../../../server/index.js';
import Cookie from 'js-cookie';
export default {
	data() {
		return {
			cname: '添加组织机构',
			flmc: '',
			page: {
				count: 0,
				pagesize: 10,
				page: 1
			},
			dialogVisible: false,
			dialogColor: false,
			dialogList: false
		};
	},
	mounted() {
		var page = 1;
		this.columnFind(page);
		Cookie.remove('tabList');
	},
	methods: {
		columnFind(page) {
			const _this = this;
			_this.page.page = page;
			let obj = {
				page: 1,
				rows:100,
			};
			// _this.tableData = []
			_this.loading = false;
			_this.http.request({
				url: deviceList,
				data: obj,
				success: function(res) {
					_this.tableData = res;
					
				}
			});
		},
		submitForm() {
		},
		addColumnClick() {
			this.ruleForm = {};
			this.dialogVisible = true;
			this.cname = '新增管理员';
		},
		cellClick(res) {
			// AccessoriesNamefind({id: res.id, token: Cookies.get('Token')}).then((res) => {
			//     if (res.data.status == 1) {
			//         _this.ruleForm = res.data.data
			//     }
			// })
			this.cname = '编辑管理员';
			this.dialogColor = true;
		}
	}
};
</script>

<style></style>
